<template>
   <div>
      <Modal v-model="visible"
      draggable
      width="600">
        <template #header>
          <p>{{data.realName}} 充值</p>
        </template>
        <div >
          {{form}}
          <Form ref="invForm" :model="form" :rules="invFormValidate" :label-width="100" label-position="left">
            <FormItem label="会员卡id" prop="cardId">
              <Input v-model="form.cardId" disabled></Input>
            </FormItem>
            <FormItem label="充值类型" prop="type">
              <RadioGroup v-model="form.type">
                <Radio :label="0">充值</Radio>
                <Radio :label="1">退款</Radio>
              </RadioGroup>
            </FormItem>
            <FormItem label="充值金额" prop="money">
              <InputNumber v-model="form.money" ></InputNumber>
            </FormItem>
            <FormItem label="优惠金额" prop="moneyOther" v-if="form.type == 0">
              <InputNumber v-model="form.moneyOther" ></InputNumber>
            </FormItem>
          </Form>
        </div>
        <template #footer>
          <Button type="info"  :loading="submitLoading" @click="deposit">充值</Button>
        </template>

      </Modal>
   </div>
</template>

<script>
import {addDeposit} from "@/api/vip/vipDeposit";

export default {
  name: "inverst", // 重置
  props: {
    value: {
      type: Boolean,
      default: false
    },
    data: {
      type: Object
    },
  },
  data(){
    return {
      visible: false,
      submitLoading: false,
      form: {
        cardId: '',
        money: 0,
        type: 0,
        moneyOther: 0
      },
      invFormValidate: {
        cardId: [
          { required: true, message: "请输入会员卡id", trigger: "change" },
        ],
        money: [
          { required: true, message: "请输入金额", trigger: "change", type: "number" },
        ],
        type: [
          { required: true, message: "请选择类型", trigger: "change",type: "number" },
        ],
        moneyOther: [
          { required: true, message: "请输入优惠金额", trigger: "change",type: "number" },
        ]

      }
    }
  },
  methods: {
    init(){},
    setCurrentValue(value){
      if (value === this.visible) {
        return;
      }
      this.form.cardId = this.data.cardId
      this.visible = value;
    },
    deposit(){
      let _this = this;
      _this.submitLoading = true;
      _this.$refs.invForm.validate((valid) => {
        if(valid){
          addDeposit(this.form).then(res => {
            _this.submitLoading = false;
            if(res.success){
              _this.$Message.success(res.result);
              _this.$emit("close", true);
              _this.visible = false;
            }
          })
        }
        _this.submitLoading = false;
      })
    }
  },
  watch: {
    value(val){
       this.setCurrentValue(val);
    },
    visible(value){
      this.$emit("input", value);
    }
  }
}
</script>

<style scoped>

</style>
